import Vue from 'vue';
import Vuex from 'vuex';
// 按需导入 API 方法
import { getUserInfoAPI,getUserProfileAPI  } from '@/api/userAPI.js'
Vue.use(Vuex);
// {"token":"be716651-41a4-4f81-bf5a-560b5eab0306","refresh_token":"d7193540-0fd7-4b4e-8d76-2a61660aca5b"}
// 定义initstate为一个对象
const initState = {
  tokenInfo:{
    token:'',
    refresh_token:''
  },
  userInfo:{},
  // 用户的简介信息
  userProfile: {}
}
// 从localStorage获取tokenInfo
localStorage.getItem('state') ? initState.tokenInfo = JSON.parse(localStorage.getItem('state')) : initState.tokenInfo = {}
console.log(initState,'---')
export default new Vuex.Store({
  state: {
    tokenInfo:initState.tokenInfo,
    userInfo:initState.userInfo,
    userProfile:initState.userProfile
  },
  mutations: {
    updataTokenInfo(state,payload){
      state.tokenInfo = payload;
      localStorage.setItem('state',JSON.stringify(payload))
     },
     // 将 state 持久化存储到本地
     saveStateToStorage(state) {
       localStorage.setItem('state', JSON.stringify(state))
     },
    clearToken(state){
      state.tokenInfo = {
        token:'',
        refresh_token:''
      },
      localStorage.removeItem('state')
    },
    // 更新 userInfo 的方法
    updateUserInfo(state, payload) {
      // 1. 把用户信息转存到 state 中
      state.userInfo = payload
      // 2. 将最新的 state 对象持久化存储到本地
      this.commit('saveStateToStorage')
    },
    // 清空 vuex 和本地的数据
    cleanState(state) {
      // 1. 清空 vuex 中的数据
      state.tokenInfo = {}
      state.userInfo = {}
      state.userProfile = {}
    
      // 2. 将清空后的 state 存储到本地
      this.commit('saveStateToStorage')
    },
    // 更新 userProfile 的方法
    updateUserProfile(state, payload) {
      state.userProfile = payload
      this.commit('saveStateToStorage')
    },
  },
  actions: {
    // 初始化用户的基本信息
      async initUserInfo(ctx) {
        // 调用 API 接口
        const { data: res } = await getUserInfoAPI()
        if (res.message === 'OK') {
          // TODO：把数据转交给 Mutation 方法   ctx.commit('Mutation方法名')
          ctx.commit('updateUserInfo', res.data)
        }
      },
      // 初始化用户的简介信息
      async initUserProfile(ctx) {
        // 调用 API 接口
        const { data: res } = await getUserProfileAPI()
        if (res.message === 'OK') {
          // TODO：把请求到的数据转交给 Mutation 方法   ctx.commit('Mutation方法名')
          ctx.commit('updateUserProfile', res.data)
        }
      }
  },
  modules: {
  },
});
